<template>
	<!--机构/团体认证信息 附件上传-->
	<view class="">
		<view class="flex padding-left-sm padding-right-xs padding-top padding-bottom">
			<view class="flex-sub" @click="BackPage">
				<text class="cuIcon-back" style="font-size: 44rpx;"></text>
			</view>
			<view class="flex-treble text-center basic-title">机构/团体认证信息</view>
			<view class="flex-sub"></view>
		</view>
		<view class="content">
			<!-- <view class="progress1">
				<view class="progress-circle-1">
					<image class="ciecle-icon" src="../..https://txr001.zthj.net/static/img/green-circle.png" mode=""></image>
					<image class="right-icon" src="../..https://txr001.zthj.net/static/img/right.png" mode=""></image>
					<text class="progress-text">认证信息</text>
				</view>
				<view class="progress-line"></view>
				<view class="progress-circle-1">
					<image class="ciecle-icon" src="../..https://txr001.zthj.net/static/img/green-circle.png" mode=""></image>
					<text class="progress-text">附件上传</text>
				</view>
			</view> -->
			<view class="flex justify-start align-center">
				<view class="basic-content-left"></view>
				<view class="basic-content-title">附件上传（必填）</view>
			</view>
			<view class="basic-update-title padding-top-32">
				组织机构代码证/登记证书复印件：
			</view>
			<view @click="ChooseImage(1)" class="yyzz-content flex align-center justify-center">
				<view class="yyzz flex align-center justify-center" :style="{backgroundImage:`url(${zhizhao_url})`}">
					<view class="camera-content flex align-center justify-center">
						<image src="../..https://txr001.zthj.net/static/camera.png" class="camara-img"></image>
					</view>
				</view>
			</view>
			<view class="padding-top-32 update-info">
				注:1.请上传组织机构代码证/登记证书复印件,JPG或PNG格式,
				<view style="padding-left: 50rpx;">大小不超过5MB,拍摄时确保内容完整,字体清晰,亮度均匀；</view>
				<view class="padding-left">2.营业执照信息必须与工商信息一致;</view>
				<view class="padding-left">3.营业执照必须加盖企业公章。</view>
			</view>
			<view class="basic-update-title padding-top-48 flex justify-between align-center">
				<view class="text-bold">委托授权书（盖章）：</view>
				<view @click="fileUpload">
					<image src="../..https://txr001.zthj.net/static/khxz.png" class="basic-title-img"></image>
					<text class="wtsqs-class">委托授权书</text>
				</view>
			</view>
			<view @click="ChooseImage(2)" class="yyzz-content flex align-center justify-center">
				<view class="sqs flex align-center justify-center" :style="{backgroundImage:`url(${shouquan_url})`}">
					<view class="camera-content flex align-center justify-center">
						<image src="../..https://txr001.zthj.net/static/camera.png" class="camara-img"></image>
					</view>
				</view>
			</view>
			<view class="padding-top-32 update-info">
				注:1.请下载委托授权书根据要求填写然后加盖企业公章
				<view class="padding-left">2.JPG或PNG格式，大小不超过5MB，拍摄时确保内容完整,字体清晰,亮度均匀；</view>
			</view>
			<view class="padding flex flex-wrap justify-center align-center">
				<button class="cu-btn round submit-btn" @click="submitInfo">提交信息</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				zhizhao_url: 'https://txr001.zthj.net/static/zs.png',
				shouquan_url: 'https://txr001.zthj.net/static/sqs.png',
				renzheng_id: 0
			}
		},
		onLoad(options) {
			this.renzheng_id = options.id;
			this.getInfo(options.id);
		},
		methods: {
			ChooseImage(type) {
				let that = this;
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album'], //从相册选择
					success: (res) => {
						// console.log();
						this.postImg(res.tempFilePaths[0], type)
					}
				});
			},
			submitInfo() {
				if (this.zhizhao_url == 'https://txr001.zthj.net/static/zs.png') {
					uni.showToast({
						title: '请上传营业执照！',
						icon: 'none'
					});
					return;
				}
				if (this.shouquan_url == 'https://txr001.zthj.net/static/sqs.png') {
					uni.showToast({
						title: '请上传授权委托书！',
						icon: 'none'
					});
					return;
				}


				uni.request({
					url: 'https://qd.zthj.net/api/userinfo/image',
					data: {
						// user_id: uni.getStorageSync('user_id'),
						zhizhao_url: this.zhizhao_url,
						shouquan_url: this.shouquan_url,
						id: this.renzheng_id
					},
					method: "POST",
					success: (res) => {
						if (res.data.code == 1) {
							setTimeout(() => {
								uni.showToast({
									title: '提交成功！',
									icon: 'none'
								});
								setTimeout(() => {
									uni.hideToast();
									//关闭提示后跳转
									uni.navigateTo({
										url: "/pages/groups/success?type=2"
									});
								}, 1500)
							}, 0);

						} else {
							uni.showToast({
								title: '提交失败！',
								icon: 'none'
							})
						}
					}
				});
			},
			BackPage() {
				uni.navigateBack({
					delta: 1
				});
			},
			postImg(imgFilePaths, type) {
				uni.uploadFile({
					url: 'https://qd.zthj.net/api/Common/upload',
					filePath: imgFilePaths,
					name: 'file',
					success: (res) => {
						let info = JSON.parse(res.data)
						// console.log(res.data);
						if (type == 1) {
							this.zhizhao_url = info.data.fullurl;
						} else {
							this.shouquan_url = info.data.fullurl;
						}
					}
				});
			},
			getInfo: function(id) {
			
				let that = this;
				uni.request({
					url: 'https://qd.zthj.net/api/userinfo/rzDetail', //仅为示例，并非真实接口地址。
					data: {
						id: id
					},
					success: (res) => {
						// console.log(res.data);
						if (res.data.length > 0) {
							that.shouquan_url = res.data[0].shouquan_url;
							that.zhizhao_url = res.data[0].zhizhao_url;
						
						}
					}
				});
			},
			fileUpload(){
				window.open(
					"https://txr001.zthj.net/asd.pdf"
				)
			}
		}
	}
</script>

<style scoped>
	.status_bar {
		height: var(--status-bar-height);
		width: 100%;
		background-color: #FFFFFF;
	}

	.top_view {
		height: var(--status-bar-height);
		width: 100%;
		position: fixed;
		background-color: #FFFFFF;
		top: 0;
		z-index: 999;
	}

	page {
		background-color: #FFFFFF;
	}

	.basic-title {
		font-size: 34rpx;
		font-weight: 600;
		color: #26292C;
	}

	.basic-content-left {
		width: 8rpx;
		height: 32rpx;
		background: #315BB7;
		border-radius: 8px 8px 8px 8px;
	}

	.basic-content-title {
		font-size: 32rpx;
		font-weight: 600;
		color: #315BB7;
		padding-left: 12rpx;
	}

	.basic-qy-name {
		font-size: 28rpx;
		font-weight: 500;
		color: #222222;
		padding-top: 32rpx;
	}

	.content {
		padding: 48rpx 32rpx 148rpx 32rpx;
	}

	.submit-btn {
		margin-top: 80rpx;
		width: 360rpx;
		height: 88rpx;
		line-height: 88rpx;
		background: #24458E;
		border-radius: 50rpx 50rpx 50rpx 50rpx;
		color: white;
	}

	.basic-update-title {
		font-size: 28rpx;
		font-weight: 500;
		color: #222222;
	}

	.yyzz-content {
		padding: 32rpx 56rpx 0 56rpx;
	}

	.yyzz {
		/* background-image: url('../..https://txr001.zthj.net/static/zs.png'); */
		background-size: 100% 100%;
		width: 568rpx;
		height: 336rpx;
	}

	.sqs {
		/* background-image: url('../..https://txr001.zthj.net/static/sqs.png'); */
		background-size: 100% 100%;
		width: 568rpx;
		height: 336rpx;
	}

	.camera-content {
		width: 159rpx;
		height: 159rpx;
		line-height: 159rpx;
		background: #333333;
		border-radius: 100%;
		opacity: 0.5;
	}

	.camara-img {
		width: 68rpx;
		height: 68rpx;
	}

	.update-info {
		font-size: 24rpx;
		font-weight: 400;
		color: #AEAEAE;
	}

	.basic-title-img {
		width: 32rpx;
		height: 32rpx;
		vertical-align: middle;
	}

	.wtsqs-class {
		font-size: 24rpx;
		font-weight: 400;
		color: #333333;
		display: inline;
		vertical-align: middle;
		margin-left: 10rpx;
		border-bottom: 2rpx solid #333333;
	}
</style>